<template>
  <div class="container">
    <div class="zzsc">
      <section class="bannerimg" style="background:url(/img/qybzsbanner.jpg) no-repeat center"></section>
      <section class="zzsc0">
        <h3>精选资质审批服务</h3>
        <p class="xq">品质推荐 我们为您省钱</p>
        <ul class="af ul1">
          <li class="li1">
            <h4>建筑资质 </h4>
            <p class="p1">建筑工程设计、招投标、施工等业务必备</p>
            <ul class="ul2 af">
              <li class="l1" v-for="(gs,id) in title.zym.service[1].threeServiceRes" :key="id" :class="'l'+(id+1)">
                <a href="/ServiceDetails/138?name=92" target="_blank">
                  <h5>{{gs.servicename}}</h5>
                  <p class="p2">{{gs.remark}}</p>
                </a>
              </li>
            </ul>
          </li>
          <li class="li2">
            <h4>网络游戏 </h4>
            <p class="p1">网络游戏开发、运营等业务必备</p>
            <ul class="ul2 af">
              <li class="l" v-for="(gs,id) in title.zym.service[2].threeServiceRes" :key="id" :class="'l'+(id+5)">
                <a :href="'/ServiceDetails/94?name=92'" target="_blank">
                  <h5>{{gs.servicename}}</h5>
                  <p class="p2">{{gs.remark}}</p>
                </a>
              </li>
            </ul>
          </li>
        </ul>
      </section>
      <section class="zzsc1">
        <h3>互联网 </h3>
        <p class="xq" style="background: none">电子商务、盈利性网站建设等营利性互联网活动必备</p>
        <ul class="af">
          <li class="li" v-for="(gs,id) in title.zym.service[3].threeServiceRes" :key="id" :class="'li'+(id+1)" >
            <a href="/ServiceDetails/93?name=92" target="_blank">
              <h4>{{gs.servicename}}</h4>
              <p>{{gs.remark}}</p>
            </a>
          </li>
        </ul>
      </section>
      <section class="zzsc2">
        <div class="ct af">
          <div class="left">
            <h4>食品行业 <span>开餐馆、做食品等相关业务必备</span></h4>
            <ul>
              <li  v-for="(gs,id) in title.zym.service[4].threeServiceRes" :class="'li'+(id+1)" :key="id"><span></span><em>{{gs.servicename}}</em><i>{{gs.remark}}</i><a :href="splj[id]" target="_blank">详情</a></li>
            </ul>
          </div>
          <div class="rt">
            <h4>文化出版 <span>电视、电影、互联网影视剧制作及出版行业必备</span></h4>
            <ul>
              <li v-for="(gs,id) in title.zym.service[5].threeServiceRes" :class="'li'+(id+1)" :key="id"><span></span><em>{{gs.servicename}}</em><i>{{gs.remark}}</i><a :href="gblj[id]" target="_blank">详情</a></li>
            </ul>
          </div>
        </div>
      </section>
      <section class="zzsc3">
        <h3>其它行业 </h3>
        <p class="xq" style="background: none">专业办理 下证快 费用低</p>
        <ul class="af">
          <li class="li1" v-for="(gs,id) in title.zym.service[6].threeServiceRes">
            <img :src="gs.fouriconimg?'https://exam.zhonghaiqihang.com/'+gs.fouriconimg:'/static/img/zzsc3'+(id+1)+'.png'" width="60" height="60" @click="xqymtz(gs.id,gs.pid)">
            <div :style="{'width':id == 4 ? '220px':'225px'}">
              <h4>{{gs.servicename}}</h4>
              <p>{{gs.remark}}</p>
            </div>
          </li>
        </ul>
      </section>
      <section class="zzsc4">
        <h3>高新认证 </h3>
        <p class="xq">深谙科委高新小组审核规则，申请快速通过不耽搁</p>
        <ul class="af">
          <li class="li" v-for="(gs,id) in title.zym.service[0].threeServiceRes" :class="['li'+(id+1)]" @click="xqymtz(gs.id,gs.pid)">
            <div>
              <h4>{{gs.servicename}}</h4>
              <p>{{gs.remark}}</p>
            </div>
          </li>

        </ul>
      </section>
      <section class="rssc4 rssc">
        <h3>咨询管家</h3>
        <p class="xq">专业管家在线服务，一对一免费咨询</p>
        <ul class="af">
          <li  v-for="(gj,gji) in title.gj" :class="['li'+(gji+1),(gji+1)%5==0?'last':'']" :key="gji">
            <div class="nm" :style="{background:'url('+'https://exam.zhonghaiqihang.com'+gj.specialavatarone+') no-repeat'}">
              <h4>{{gj.username}}</h4>
              <p>{{gjname[gji]}}</p>
            </div>
            <div class="hover af">
              <img :src="'https://exam.zhonghaiqihang.com'+gj.specialavatartwo" width="157" height="158">
              <div>
                <p class="p1">{{gj.username}}  <span>{{title.zym.label}}</span></p>
                <p class="p2">电话： <span>{{gj.mobile}}</span></p>
                <p class="p3">擅长: {{gj.major}}</p>
                <a :href="gj.cclink" class="zx" target="_blank">在线咨询</a>
              </div>
            </div>
          </li>

        </ul>
      </section>
      <my-heart></my-heart>
    </div>
    <my-ft></my-ft>
  </div>
</template>

<script>
  import axios from 'axios';
  import $ from 'jquery';
  export default {
    name: 'HelloWorld',
    data () {
      return {
        nihao:'你好呀',
        selenv:false,
        dlzt:'',
        title:null,
        splj:['/ServiceDetails/95?name=92','/ServiceDetails/109?name=92','/ServiceDetails/95?name=92','/ServiceDetails/95?name=92','/ServiceDetails/95?name=92'],
        gblj:['/ServiceDetails/96?name=92','/ServiceDetails/112?name=92','/ServiceDetails/105?name=92','/ServiceDetails/105?name=92','/ServiceDetails/111?name=92'],
        fuwu:1,
        sjsz:[],
        gjname:['经营资质顾问','经营资质顾问','经营资质顾问','经营资质顾问','经营资质顾问','经营资质顾问','经营资质顾问','经营资质顾问','经营资质顾问','经营资质顾问'],
      }
    },
    async asyncData ({ params }) {
    let nh = await axios.get(`https://exam.zhonghaiqihang.com/PInterface/Header/headerData`);
    let nh3 = await axios.get(`https://exam.zhonghaiqihang.com/PInterface/Special/specialData`,{
      params:{
        serviceid:'91'
      }});
    let nh4 = await axios.get(`https://exam.zhonghaiqihang.com/PInterface/Receptionist/receptionistData`);
    let data  = {nav:nh.data,zym:nh3.data,gj:nh4.data};
    return { title: data}
  },
  mounted:function(){

    let a = document.cookie;
    let cookie = '';
    if(a.indexOf('userinfoRes')!=-1){
      let b = a.split('userinfoRes=');
      let c = b[1].split(';');
      cookie = c[0];
    }
    this.dlzt = cookie;
    $(document).ready(function(){
      $('.tbnava4').addClass('select');

    })
  },
  head () {
    return {
      title: this.title.zym.oneService.title,
      meta: [
        { hid: 'description', name: 'description', content: this.title.zym.oneService.descript },
        { hid: 'keywords', name: 'keywords', content:this.title.zym.oneService.keyword }
      ]
    }
  },methods:{
    xqymtz:function(e1,e2){
      let href = '/ServiceDetails/'+e1+'?name='+e2;
      window.open(href,'_blank');
    }
    ,zdwy:function(e){
      $('.tbnava4').addClass('select');

      if(e==1){
        this.selenv = true;
      }else if(e==0){
        this.selenv = false;
      }

    }
  }
  }
</script>

<style>

</style>
